.flag {
  display: inline-block;
  vertical-align: middle;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: 0 0;

  // https://www.iconfinder.com/iconsets/flags_gosquared
  $locales: 'bf' 'bg' 'cs' 'da' 'de' 'el' 'en' 'es' 'et' 'fa-IR' 'fi-FI' 'fr'
    'hr' 'it' 'ja-JP' 'lt' 'mg' 'nb' 'nl' 'pl-PL' 'pt-BR' 'pt' 'ru' 'sk' 'sl'
    'sr' 'sv' 'sv-FI' 'uk' 'zh-CN';

  @each $locale in $locales {
    &.flag-#{$locale} {
      background-image: url(asset-path('locomotive/icons/flags/#{$locale}.png'));
    }
  }

  &.flag-17-17 {
    width: 17px;
    height: 17px;
    background-size: 17px;
  }
}
